<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>The source code</title>
  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  <style type="text/css">
    .highlight { display: block; background-color: #ddd; }
  </style>
  <script type="text/javascript">
    function highlight() {
      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
    }
  </script>
</head>
<body onload="prettyPrint(); highlight();">
  <pre class="prettyprint lang-js"><span id='global-property-S-'>/**
</span> * @fileOverview 依赖扩展，用于观察者模式中的观察者
 * @ignore
 */


var $ = require(&#39;jquery&#39;),
  regexp = /^#(.*):(.*)$/,
  Manager = require(&#39;../manage&#39;);

//获取依赖信息
function getDepend(name) {

  var arr = regexp.exec(name),
    id = arr[1],
    eventType = arr[2],
    source = getSource(id);
  return {
    source: source,
    eventType: eventType
  };
}

//绑定依赖
function bindDepend(self, name, action) {
  var depend = getDepend(name),
    source = depend.source,
    eventType = depend.eventType,
    callbak;
  if (source &amp;&amp; action &amp;&amp; eventType) {

    if (BUI.isFunction(action)) { //如果action是一个函数
      callbak = action;
    } else if (BUI.isArray(action)) { //如果是一个数组，构建一个回调函数
      callbak = function() {
        BUI.each(action, function(methodName) {
          if (self[methodName]) {
            self[methodName]();
          }
        });
      }
    }
  }
  if (callbak) {
    depend.callbak = callbak;
    source.on(eventType, callbak);
    return depend;
  }
  return null;
}
//去除依赖
function offDepend(depend) {
  var source = depend.source,
    eventType = depend.eventType,
    callbak = depend.callbak;
  source.off(eventType, callbak);
}

//获取绑定的事件源
function getSource(id) {
  var control = Manager.getComponent(id);
  if (!control) {
    control = $(&#39;#&#39; + id);
    if (!control.length) {
      control = null;
    }
  }
  return control;
}

<span id='BUI-Component-UIBase-Depends'>/**
</span> * @class BUI.Component.UIBase.Depends
 * 依赖事件源的扩展
 * &lt;pre&gt;&lt;code&gt;
 *       var control = new Control({
 *         depends : {
 *           &#39;#btn:click&#39;:[&#39;toggle&#39;],//当点击id为&#39;btn&#39;的按钮时，执行 control 的toggle方法
 *           &#39;#checkbox1:checked&#39;:[&#39;show&#39;],//当勾选checkbox时，显示控件
 *           &#39;#menu:click&#39;,function(){}
 *         }
 *       });
 * &lt;/code&gt;&lt;/pre&gt;
 */
function Depends() {

};

Depends.ATTRS = {
<span id='BUI-Component-UIBase-Depends-property-depends'>  /**
</span>   * 控件的依赖事件，是一个数组集合，每一条记录是一个依赖关系&lt;br/&gt;
   * 一个依赖是注册一个事件，所以需要在一个依赖中提供：
   * &lt;ol&gt;
   * &lt;li&gt;绑定源：为了方便配置，我们使用 #id来指定绑定源，可以使控件的ID（只支持继承{BUI.Component.Controller}的控件），也可以是DOM的id&lt;/li&gt;
   * &lt;li&gt;事件名：事件名是一个使用&quot;:&quot;为前缀的字符串，例如 &quot;#id:change&quot;,即监听change事件&lt;/li&gt;
   * &lt;li&gt;触发的方法：可以是一个数组，如[&quot;disable&quot;,&quot;clear&quot;],数组里面是控件的方法名，也可以是一个回调函数&lt;/li&gt;
   * &lt;/ol&gt;
   * &lt;pre&gt;&lt;code&gt;
   *       var control = new Control({
   *         depends : {
   *           &#39;#btn:click&#39;:[&#39;toggle&#39;],//当点击id为&#39;btn&#39;的按钮时，执行 control 的toggle方法
   *           &#39;#checkbox1:checked&#39;:[&#39;show&#39;],//当勾选checkbox时，显示控件
   *           &#39;#menu:click&#39;,function(){}
   *         }
   *       });
   * &lt;/code&gt;&lt;/pre&gt;
   * ** 注意：** 这些依赖项是在控件渲染（render）后进行的。
   * @type {Object}
   */
  depends: {

  },
<span id='BUI-Component-UIBase-Depends-property-dependencesMap'>  /**
</span>   * @private
   * 依赖的映射集合
   * @type {Object}
   */
  dependencesMap: {
    shared: false,
    value: {}
  }
};

Depends.prototype = {

  __syncUI: function() {
    this.initDependences();
  },
<span id='BUI-Component-UIBase-Depends-method-initDependences'>  /**
</span>   * 初始化依赖项
   * @protected
   */
  initDependences: function() {
    var _self = this,
      depends = _self.get(&#39;depends&#39;);
    BUI.each(depends, function(action, name) {
      _self.addDependence(name, action);
    });
  },
<span id='BUI-Component-UIBase-Depends-method-addDependence'>  /**
</span>   * 添加依赖，如果已经有同名的事件，则移除，再添加
   * &lt;pre&gt;&lt;code&gt;
   *  form.addDependence(&#39;#btn:click&#39;,[&#39;toggle&#39;]); //当按钮#btn点击时，表单交替显示隐藏
   *
   *  form.addDependence(&#39;#btn:click&#39;,function(){//当按钮#btn点击时，表单交替显示隐藏
   *   //TO DO
   *  });
   * &lt;/code&gt;&lt;/pre&gt;
   * @param {String} name 依赖项的名称
   * @param {Array|Function} action 依赖项的事件
   */
  addDependence: function(name, action) {
    var _self = this,
      dependencesMap = _self.get(&#39;dependencesMap&#39;),
      depend;
    _self.removeDependence(name);
    depend = bindDepend(_self, name, action)
    if (depend) {
      dependencesMap[name] = depend;
    }
  },
<span id='BUI-Component-UIBase-Depends-method-removeDependence'>  /**
</span>   * 移除依赖
   * &lt;pre&gt;&lt;code&gt;
   *  form.removeDependence(&#39;#btn:click&#39;); //当按钮#btn点击时，表单不在监听
   * &lt;/code&gt;&lt;/pre&gt;
   * @param  {String} name 依赖名称
   */
  removeDependence: function(name) {
    var _self = this,
      dependencesMap = _self.get(&#39;dependencesMap&#39;),
      depend = dependencesMap[name];
    if (depend) {
      offDepend(depend);
      delete dependencesMap[name];
    }
  },
<span id='BUI-Component-UIBase-Depends-method-clearDependences'>  /**
</span>   * 清除所有的依赖
   * &lt;pre&gt;&lt;code&gt;
   *  form.clearDependences();
   * &lt;/code&gt;&lt;/pre&gt;
   */
  clearDependences: function() {
    var _self = this,
      map = _self.get(&#39;dependencesMap&#39;);
    BUI.each(map, function(depend, name) {
      offDepend(depend);
    });
    _self.set(&#39;dependencesMap&#39;, {});
  },
  __destructor: function() {
    this.clearDependences();
  }

};

module.exports = Depends;
</pre>
</body>
</html>
